*{
    margin: 0;
    padding: 0;
    list-style: none;
}
.zbc{
    width: 3.6rem;
    margin: 0 auto;
}
#a{
    
   .b{
    width: 100%;
    height: .44rem;
    background-color: #FF6040;
  
    .bb{
        .zbc;
        height: .44rem;
        line-height: .44rem;
        display: flex;
        justify-content: space-between;
        
    }
    .c{
        width: .09rem;
        height: 0.17rem;
        margin-top: .10rem;
    }
    .d{
      opacity: 0.8;
      margin-left: .3rem;
      font-family: Helvetica;
      font-size: .17rem;
      color: #FFFFFF;
      letter-spacing: 0;
      text-align: center;
    }
    .dd{
        width: 0.4rem;
    }
  }
  .e{
      margin-top: -0.01rem;
      width: 100%;
      height: .6rem;
    background-image: linear-gradient(180deg, #FF6040 0%, #FF8A80 100%);
    box-shadow: 0 .02rem .06rem 0 rgba(255,149,128,0.50);
    .ee{
        .zbc;
        display: flex;
        justify-content: space-between;
        img{
            height: .2rem;
            width: .2rem;
        }
        .eee{
            width: .91rem;
            height: .24rem;
            
        }
        .eeee{
            width: 1.7rem;
            height: 0.32rem;
            background-color: white;
            border-radius: .05rem;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-top: -0.05rem;
            span{
                font-size: .16rem;
                color: silver;
            }
        }
    }
    .f{
        .zbc;
        height: .32rem;
        display: flex;
        font-size: .16rem;
        align-items: center;
        justify-content: space-between;
        color: white;
        .ff{
            display: flex;
            box-shadow: -0.05rem .05rem .1rem -0.05rem #E63D2E;
             img{
            width: .15rem;
            height: .15rem;
            margin-top: .04rem;
        }
        }
       

    }
  }

  .g{
      .zbc;
      .ia{
          width: 3.35rem;
          height: 1.95rem;
          margin: .2rem .1rem;
      }
      .gg{
          display: flex;
          height: 0.5rem;
          justify-content: space-around;
        .ggg{
          font-size: .12rem;
        }
     
        img{
            width: .4rem;
            height: .4rem;
        }
      }
      .gggg{
        display: flex;
      height: 0.4rem;
       justify-content: space-between;
   }
  }
 
  .h{
      width: 100%;
      background-color: silver;
      .content_main{
          height: 1.95rem;
         .zbc;
        margin: 0 auto;
        display: flex;

        .left{
            width: 1.75rem;
            height: 1.75rem;
            background:url('../images/big.png');
            background-size:cover;
            margin-top: .1rem;
            .hh{
                width: 1.5rem;
                height: .16rem;
                margin: .05rem auto;
                display: flex;
                justify-content: space-between;
                line-height: .16rem;
                span{
                    &:nth-child(1){
                        font-size: .16rem;
                        color: #85A642;
 
                    }
                    &:nth-child(2){
                        font-size: .12rem;
                    }
                }
            }
            .hhh{
                width: 1.5rem;
                height: .1rem;
                margin: .01rem auto;
                  font-size: .1rem;
                 color: #B1CC7A;
            }
            .hhhh{
                width: 1.5rem;
                height: .1rem;
                margin: .01rem auto;
                  font-size: .1rem;
                 color: #B1CC7A; 
                 display: flex;
                 span{
                     margin-left: 0.02rem;
                     margin-top: 0.05rem;
                 }
                 .hhhhh{
                 width: .16rem;
                 height: .18rem;
                 background-image: linear-gradient(180deg, #85A642 0%, #B1CC7A 100%);
                 border-radius: .01rem;  
                 text-align: center;
                 line-height: .18rem; 
                 color: rgb(255, 255, 255);     
               }
            
            }
           
        }
        .right{
            height: 1.75rem;
            margin-top: .1rem;
            margin-left: .1rem;
            .top{
              
                width: 1.75rem;
                height: .85rem;
                background: url('../images/small.png');
                background-size:cover;
                .hhhhhh{
                    height: .3rem;
                    width: 0.8rem;
                    text-align: center;
                    line-height: .3rem;
                    font-size: .16rem;
                    color: #FF6040;
                }
                .hhhhhhh{
                    height: .25rem;
                    width: .9rem;
                    text-align: center;
                    line-height: .25rem;
                    font-size: .1rem;
                    color: #FF9580;
                }
                .hhhhhhhh{
                    height: .2rem;
                    width: 0.7rem;
                    text-align: center;
                    line-height: .2rem;
                    background-image: linear-gradient(180deg, #FF6040 0%, #FF9F80 100%);
                    border-radius: .02rem .12rem .12rem .02rem;
                    margin-left: .1rem;
                    font-size: .12rem;
                    color: white;
                }
            }
            .bottom{
                width: 1.75rem;
                height: .85rem;
                margin-top: .05rem;      
                background: url('../images/2.png');
                background-size:cover;
                .i{
                    height: .3rem;
                    width: 0.8rem;
                    text-align: center;
                    line-height: .3rem;
                    font-size: .16rem;
                    color: #AF40FF;
                }
                .ii{
                    height: .25rem;
                    width: .8rem;
                    text-align: center;
                    line-height: .25rem;
                    font-size: .1rem;
                    color: #CA80FF;
                }
                .iii{
                    height: .2rem;
                    width: 0.7rem;
                    text-align: center;
                    line-height: .2rem;
                    background-image:  linear-gradient(180deg, #AF40FF 0%, #F58CFF 100%);
                    border-radius: .02rem .12rem .12rem .02rem;
                    margin-left: .1rem;
                    font-size: .12rem;
                    color: white;
                }
            }
        }
    } 
    .j{
        .zbc;
        background-color: white;
        .jj{
            display: flex;
            justify-content: space-between;
            margin: 0 auto;
            width: 2.5rem;
            height: .35rem;
            font-size: .15rem;
            line-height: 0.35rem;
            span{
                &:nth-child(1){
                    color: #e66c47;
                }
                &:nth-child(2){
                    color: #999;
                }
            }
        }
      .k{
          display: flex;
          justify-content: space-around;
          img{
              width: 0.8rem;
              height: 0.8rem;
          }
      }

      .jjj{
        display: flex;
        margin: 0 auto;
        line-height: .32rem;
        div{
            width:33%;
            height: .35rem;
            line-height: .32rem;
            text-align: center;
            margin-top: .1rem;
            margin-bottom: .1rem;
            font-size: .16rem;
        }
      }
    }

    .l{
        .zbc;
        background-color: white;
        overflow: hidden;
        div
        {
            border: .01rem solid #ddd;
            width: 2.9rem;
            height: 1.375rem;
            margin: .2rem auto;
            box-shadow: 0 .02rem .06rem 0 rgba(85, 85, 85, 0.5);
            display: flex;
            img{
                width: 0.6rem;
                height: 1rem;
                margin: .2rem ;
            }
            .ll{
                height: 0.8rem;
                margin-top: .2rem;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                p{
                    &:nth-child(1){
                        font-size: .13rem;
                    }
                    &:nth-child(2){
                        font-size: .13rem;
                        color: red;
                    }
                    &:nth-child(3){
                        font-size: .13rem;
                        color: rgb(211, 211, 211);
                        text-decoration:line-through
                    }
                    &:nth-child(4){
                        font-size: .13rem;
                        color: white;
                        width: .7rem;
                        height: .2rem;
                        font-weight: bold;
                        text-align: center;
                        line-height: .2rem;
                        background-color: #f2a93a;
                    }
                }
            }
        }
    }
  }
 .nav{
    
    width: 100%;
    
    position: fixed;
    
    bottom: 0;
    
    height: .6rem;
    
    background: rgb(255, 255, 255);
    
    border-top:1px solid #888 ;
    
 .ul1{
     width: 3rem;
    display: flex;
    margin: 0 auto;
li{ 
    width: .4rem;
    margin-top: .06rem;
    width: 25%;
    text-align: center;
.img{
    width: .18rem;
    height: .2rem;
    margin-left: .19rem;
 }
 }
 }
.ul2{
    width: 3rem;
   display: flex;
   margin: 0 auto;
.li3{ 
   width: .4rem;
   margin-top: .06rem; 
   width: 25%;
   text-align: center; 
}
}
}
 .main{
     width: 94.7%;
     height: 6.7rem;
     margin-left: 2.7%;
     margin-right: 2.7%;
     margin-top: .1rem;
     margin-bottom: 1.2%;
     background-color: #FFFFFF;
     .main-pic{
         img{
            margin-left:23.2% ;
            margin-right: 22.9%;
            margin-top: 2.44rem;
           margin-bottom: .4rem;
         }
      
     }
     .input-name{
         margin: 0 auto; 
         input{
             margin-left: .1rem;
             border-bottom: 0 solid #EEEEEE;;
            margin-top: .2rem;
         }
     }
     button{
         width: 3.05rem;

         height: .49rem;
         margin-top: .2rem;
         margin-left: .25rem;
         font-family: PingFangSC-Semibold;
     font-size: 16px;
            color: #FFFFFF;
     text-align: center;
line-height: .16rem;
background-color: #CCCCCC;
border: none;
     }
 }
}